<template>
	<view style="background-color: #ffffff;" >
		<view style="height: 5rpx;width: 100%;"></view>
		
		<!--收获人地址-->
		<view class="cardBox">
			<view class="flex" style="margin-top: 10rpx;">
				<view class="biao">
					<span class="biao_span">|</span> 
					<text class="cardTitle">{{text.consignees}} </text>
				</view>
				<view class="edit" @click="xgConsignee()" v-if="consignee && consignee_tel && show">{{text.edit_consignee}}</view>
				<view class="edit" @click="saveConsignee()" v-else-if="!consignee && !consignee_tel && show">{{$t("添加收货人")}}</view>
			</view>
			
			<view class="text"  style="margin-top: 10rpx;">
				{{text.consignee}} : {{consignee||''}}
			</view>
			<view class="text" style="margin-top: 10rpx;">
				{{text.mobile}} : {{consignee_tel||''}}
			</view>
		</view>
		
		<!--口岸交接人信息-->
		<view class="cardBox" v-if="orderDetail.orderInfo.type=='crossborder'">
			<view class="flex" style="margin-top: 10rpx;">
				<view class="biao">
					<span class="biao_span">|</span> 
					<text class="cardTitle">{{$t("口岸交接人信息")}} </text>
				</view>
				<view class="edit" @click="xgKaConsignee()" v-if="kaconsignee && kaconsignee_tel && orderDetail.role==2">{{$t("修改交接人")}}</view>
				<view class="edit" @click="saveKaConsignee()" v-else-if="!kaconsignee && !kaconsignee_tel && orderDetail.role==2">{{$t("添加交接人")}}</view>
			</view>
			
			<view class="text"  style="margin-top: 10rpx;">
				{{$t("口岸交接人")}} : {{kaconsignee||''}}
			</view>
			<view class="text" style="margin-top: 10rpx;">
				{{text.mobile}} : {{kaconsignee_tel||''}}
			</view>
		</view>
		
		
		<!--始发地与目的地-->
		<view class="flex" style="margin-top: 10rpx;">
		
			<view class="cardBox2">
				<view class="flex" style="margin-top: 10rpx;">
					<view class="biao">
						<span class="biao_span">|</span> 
						<text class="cardTitle">{{text.start_address}} </text>
					</view>
				</view>
				
				<view v-if="orderDetail.orderInfo.type=='transport'||orderDetail.orderInfo.type=='crossborder'">
					<view class="text" style="margin-top: 10rpx;">
						{{text.country}} : {{lang=='zh'?orderDetail.orderInfo.release_info.departure_city.country_name||'':orderDetail.orderInfo.release_info.departure_city.country_name_ru}}
					</view>
					<view  class="text" style="margin-top: 10rpx;">
						{{text.city}} : {{lang=='zh'?orderDetail.orderInfo.release_info.departure_city.city_name||'':orderDetail.orderInfo.release_info.departure_city.city_name_ru}}
					</view>
					<view  class="text" style="margin-top: 10rpx;">
						{{text.address}} : {{lang=='zh'?orderDetail.orderInfo.release_info.departure_city.area_name||'':orderDetail.orderInfo.release_info.departure_city.area_name_ru}}
					</view>
				</view>
				<view v-else-if="orderDetail.orderInfo.type=='goods'">
					<view class="text" style="margin-top: 10rpx;">
						{{text.country}} : {{lang=='zh'?orderDetail.orderJoin.product_address.country_name||'':orderDetail.orderJoin.product_address.country_name_ru}}
					</view>
					<view  class="text" style="margin-top: 10rpx;">
						{{text.city}} : {{lang=='zh'?orderDetail.orderJoin.product_address.city_name||'':orderDetail.orderJoin.product_address.country_name_ru}}
					</view>
					<view  class="text" style="margin-top: 10rpx;">
						{{text.address}} : {{lang=='zh'?orderDetail.orderJoin.product_address.area_name||'':orderDetail.orderJoin.product_address.country_name_ru}}
					</view>
				</view>
			</view>
			
			<view class="cardBox2">
				<view class="flex" style="margin-top: 10rpx;">
					<view class="biao">
						<span class="biao_span">|</span> 
						<text class="cardTitle">{{text.end_address}} </text>
					</view>
				</view>
				
				<view  class="text" style="margin-top: 10rpx;">
					{{text.country}} : {{lang=='zh'?orderDetail.orderInfo.release_info.reach_city.country_name:orderDetail.orderInfo.release_info.reach_city.country_name_ru}}
				</view>
				<view  class="text" style="margin-top: 10rpx;">
					{{text.city}} : {{lang=='zh'?orderDetail.orderInfo.release_info.reach_city.city_name:orderDetail.orderInfo.release_info.reach_city.city_name_ru}}
				</view>
				<view  class="text" style="margin-top: 10rpx;">
					{{text.address}} : {{lang=='zh'?orderDetail.orderInfo.release_info.reach_city.area_name:orderDetail.orderInfo.release_info.reach_city.area_name_ru}}
				</view>
			</view>
		</view>
		
		<!--通关口岸-->
		<view class="cardBox" v-if="orderDetail.orderInfo.type=='goods'&&orderDetail.rlated_orders.length!=0">
			<view class="flex" style="margin-top: 10rpx;">
				<view class="biao">
					<span class="biao_span">|</span> 
					<text class="cardTitle">{{text.port_city}} </text>
				</view>
			</view>
			
			<view class="text"  style="margin-top: 10rpx;" v-if="orderDetail.crossborder_area">
				{{text.country}} : {{lang=='zh'?orderDetail.crossborder_area.country_name:orderDetail.crossborder_area.country_name_ru}}
			</view>
			<view class="text" style="margin-top: 10rpx;" v-if="orderDetail.crossborder_area">
				{{text.city}} : {{lang=='zh'?orderDetail.crossborder_area.city_name:orderDetail.crossborder_area.city_name_ru}}
			</view>
			<view class="text" style="margin-top: 10rpx;" v-if="orderDetail.crossborder_area">
				{{text.port_name}} : {{lang=='zh'?orderDetail.crossborder_area.area_name:orderDetail.crossborder_area.area_name_ru}}
			</view>
			
			<view class="text"  style="margin-top: 10rpx;" v-if="!orderDetail.crossborder_area">
				{{text.country}} : 
			</view>
			<view class="text" style="margin-top: 10rpx;" v-if="!orderDetail.crossborder_area">
				{{text.city}} : 
			</view>
			<view class="text" style="margin-top: 10rpx;" v-if="!orderDetail.crossborder_area">
				{{text.port_name}} : 
			</view>
		</view>
		<view class="cardBox" v-else-if="orderDetail.orderInfo.type=='crossborder'">
			<view class="flex" style="margin-top: 10rpx;">
				<view class="biao">
					<span class="biao_span">|</span> 
					<text class="cardTitle">{{text.port_city}} </text>
				</view>
			</view>
			
			<view class="text"  style="margin-top: 10rpx;" v-if="orderDetail.orderJoin.port_city">
				{{text.country}} : {{lang=='zh'?orderDetail.orderJoin.port_city.country_name:orderDetail.orderJoin.port_city.country_name_ru}}
			</view>
			<view class="text" style="margin-top: 10rpx;" v-if="orderDetail.orderJoin.port_city">
				{{text.city}} : {{lang=='zh'?orderDetail.orderJoin.port_city.city_name:orderDetail.orderJoin.port_city.city_name_ru}}
			</view>
			<view class="text" style="margin-top: 10rpx;" v-if="orderDetail.orderJoin.port_city">
				{{text.port_name}} : {{lang=='zh'?orderDetail.orderJoin.port_city.area_name:orderDetail.orderJoin.port_city.area_name_ru}}
			</view>
			
			<view class="text"  style="margin-top: 10rpx;" v-if="!orderDetail.orderJoin.port_city">
				{{text.country}} : 
			</view>
			<view class="text" style="margin-top: 10rpx;" v-if="!orderDetail.orderJoin.port_city">
				{{text.city}} : 
			</view>
			<view class="text" style="margin-top: 10rpx;" v-if="!orderDetail.orderJoin.port_city">
				{{text.port_name}} : 
			</view>
		</view>
		
		<!--交货时间-->
		<view class="cardBox">
			<view class="flex" style="margin-top: 10rpx;">
				<view class="biao">
					<span class="biao_span">|</span> 
					<text class="cardTitle">{{text.jiaohuo}} </text>
				</view>
			</view>
			
			<view class="text"  style="margin-top: 10rpx;" v-if="orderDetail.orderInfo.type=='transport' && (orderDetail.orderInfo.release_info.release_type==1 || orderDetail.orderInfo.release_info.human_type==2)">
				{{orderDetail.orderInfo.release_info.desire_speed}}{{$t("天")}}
			</view>
			<view class="text"  style="margin-top: 10rpx;" v-else>
				{{orderDetail.orderJoin.speed}}{{$t("天")}}
			</view>
		</view>
		
		<!--运输订单-->
		<view class="cardBox" v-if="orderDetail.orderInfo.type!='transport'" v-for="(item,index) in orderDetail.rlated_orders" :key="index">
			<view v-if="item.type=='transport'">
				<view style="margin-top: 20rpx;margin-bottom: 20rpx;">
					<view class="biao" style="width: 100%;display: flex;">
						<span class="biao_span">|</span> 
						<text class="cardTitle" style="font-size: 32rpx;">
							{{text.transport}}
							<text class="status_btn" v-if="!item.step">{{$t("待开始")}}</text>
							<text class="status_btn" v-else-if="item.step>0">{{$t("进行中")}}</text>
							<text class="status_btn" v-else-if="item.step==100">{{text.complete}}</text>
						</text>
						<view class="jiantou" style="height: auto;line-height: unset; font-weight: 500;" @click="transporturl(item)">
							>
						</view>
					</view>
					
					<view style="width: 100%;display: flex;">
						<view style="width: 60%;">
							<view class="flex" style="margin-top: 30rpx;margin-bottom: 30rpx;">
								<FromToCountry :item="{departure_country:item.orderInfo.release_info.departure_city.country,reach_country:item.orderInfo.release_info.reach_city.country,type:1}"></FromToCountry>
							</view>
							<view class="address" >
								<view class="label">{{$t("出发城市")}}</view>
								<image :src="HTTP_IMG_UTL+'tubiao1.png'" class="headline_img" />
								<view class="u-flex-1" v-if="lang=='zh'">
									{{item.orderInfo.release_info.departure_city.mergename}}
								</view>
								<view class="u-flex-1" v-else>
									{{item.orderInfo.release_info.departure_city.mergename_ru}}
								</view>
							</view>
							<view class="address" >
								<view class="label">{{$t("到达城市")}}</view>
								<image :src="HTTP_IMG_UTL+'tubiao2.png'" class="headline_img" />
								<view class="u-flex-1" v-if="lang=='zh'">
									{{item.orderInfo.release_info.reach_city.mergename}}
								</view>
								<view class="u-flex-1" v-else>
									{{item.orderInfo.release_info.reach_city.mergename_ru}}
								</view>
							</view>
							<view class="address" >
								<view class="label">{{$t("运输速度")}}</view>
								<image :src="HTTP_IMG_UTL+'/time.png'" class="headline_img" />
								<view class="u-flex-1" v-if="item.orderJoin">
									{{item.orderJoin.speed}}
								</view>
								<view class="u-flex-1" v-else>
									
								</view>
							</view>
						</view>
						<view style="width: 40%;justify-content: center;align-items: center;display: flex;">
							<image mode="widthFix" style="width: 100%;" src="https://gluz-oss.oss-cn-beijing.aliyuncs.com/uploads/20240425/686c4dbccf988d8be4d71813f59f28d4.png" class="headline_img" />
						</view>
					</view>
				</view>
				
				
				<!--进度条-->
				<view style="width: 100%;position: relative;">
					<!--货物盒  0% 23% 47% 71% 95%-->
					<image :src="HTTP_IMG_UTL+'/position.png'" 
						style="width: 50rpx;height: 50rpx;position: absolute;top: -24rpx;left: 95%;">
					</image>
					
					<view style="position: absolute;top: -20rpx; display: flex; left: 77%;">
						<text style="color: #008aff;">{{item.step||0}}%</text>
						<image :src="HTTP_IMG_UTL+'/car.png'"
							style="width: 50rpx;height: 45rpx;">
						</image>
					</view>
					
					
					<view style="padding-top: 25rpx;">
						<progress class="rounded-progress" color="#008aff" :percent="progressPercent" stroke-width="7" />
					</view>
					
					<view style="clear: both;"></view>
					
					<!--进度列表-->
					<view class="process" v-if="shouqi_btn==0">
						<view v-for="(item2,index) in item.step_list" :key="index" style="display: flex;width: 100%;margin-top: 30rpx;margin-bottom: 30rpx;">
							<view style="width: 65%;display: flex;">
								<view class="circle_dian" style="color: #999999;" >·</view>
								<view class="cardTitle2" style="color: #999999;font-size: 12px;">{{item2.location}}</view>
							</view>
							<view style="width: 35%;font-size: 12px;color: #999999;">
								{{timestampToDate(item2.createtime)}}
							</view>
						</view>
					</view>
					
					<view style="height: 20rpx;width: 100%;"></view>
				
					<view @click="shouqi" v-if="shouqi_btn==0" style="width: 100%; margin-top: 20rpx; text-align: center;">{{text.shouqi}}</view>
					
					<view @click="shouqi" v-if="shouqi_btn==1" style="width: 100%; margin-top: 20rpx; text-align: center;">
						<text style="background-color: orange;font-size: 12px;color: #ffffff; text-align: center; border-radius: 5px; padding: 5px 10px;">
							{{text.chakan}}
						</text>
					</view>
					
					<view style="height: 20rpx;width: 100%;"></view>
					
					<view style="clear: both;"></view>
					
				</view>
			</view>
		</view>
		
		
		
		<!--货代订单-->
		<view class="cardBox" v-if="orderDetail.orderInfo.type!='transport'"  v-for="(item,index) in orderDetail.rlated_orders" :key="index">
			<view style="margin-top: 20rpx;margin-bottom: 20rpx;" v-if="item.type=='crossborder'">
				<view class="biao" style="width: 100%;display: flex;">
					<span class="biao_span">|</span> 
					<text class="cardTitle" style="font-size: 32rpx;">
						{{text.crossorder}}
						<text class="status_btn" v-if="!item.step">{{$t("待开始")}}</text>
						<text class="status_btn" v-else-if="item.step>0">{{$t("进行中")}}</text>
						<text class="status_btn" v-else-if="item.step==100">{{text.complete}}</text>
					</text>
					<view class="jiantou" v-if="item.join_user_id" style="height: auto;line-height: unset; font-weight: 500;" @click="crossborderurl(item)">
						>
					</view>
				</view>
				
				<view style="width: 100%;display: flex;">
					<view style="width: 60%;">
						<view class="flex" style="margin-top: 30rpx;margin-bottom: 30rpx;">
							<FromToCountry :item="{departure_country:item.orderInfo.release_info.departure_city.country,reach_country:item.orderInfo.release_info.reach_city.country,type:1}"></FromToCountry>
						</view>
						<view class="address" >
							<view class="label">{{$t("通关口岸")}}</view>
							<image :src="HTTP_IMG_UTL+'tubiao1.png'" class="headline_img" />
							<view class="u-flex-1" v-if="lang=='zh'">
								{{item.orderInfo.release_info.port_city.mergename}}
							</view>
							<view class="u-flex-1" v-else>
								{{item.orderInfo.release_info.port_city.mergename_ru}}
							</view>
						</view>
						<view class="address" >
							<view class="label">{{$t("运输速度")}}</view>
							<image :src="HTTP_IMG_UTL+'/time.png'" class="headline_img" />
							<view class="u-flex-1" v-if="item.orderJoin">
								{{item.orderJoin.speed}}
							</view>
							<view class="u-flex-1" v-else>
								
							</view>
						</view>
					</view>
					<view style="width: 35%;justify-content: center;align-items: center;display: flex;">
						<Server :item="{clearance:'报关',is_load_unload:item.orderInfo.release_info.is_load_unload,is_express_price:item.orderInfo.release_info.is_express_price,is_warehouse:item.orderInfo.release_info.is_warehouse}" v-if="item.clearance==1"> </Server>
						<Server :item="{clearance:'清关',is_load_unload:item.orderInfo.release_info.is_load_unload,is_express_price:item.orderInfo.release_info.is_express_price,is_warehouse:item.orderInfo.release_info.is_warehouse}" v-if="item.clearance==2"> </Server>
						<Server :item="{clearance:'报关+清关',is_load_unload:item.orderInfo.release_info.is_load_unload,is_express_price:item.orderInfo.release_info.is_express_price,is_warehouse:item.orderInfo.release_info.is_warehouse}" v-if="item.clearance==3"> </Server>
					</view>
				</view>
			</view>
		</view>
		
		
		
		<!--运输进度-->
		<view class="cardBox">
			<view class="flex" style="margin-top: 10rpx;">
				<view class="biao">
					<span class="biao_span">|</span> 
					<text class="cardTitle">{{text.transport_process}} </text>
				</view>
			</view>
			
			<!--运输进度-->
			<view style="display: flex;width: 100%;margin-top: 30rpx;"  v-for="(item,index) in orderDetail.stepList" :key="index">
				<view style="width: 65%;display: flex;">
					<view class="circle_dian" style="color: #999;" >·</view>
					<view class="cardTitle2" style="font-size: 12px;">{{text.transport_process}}{{item.step}}% {{item.location}}</view>
				</view>
				<view style="width: 35%;font-size: 12px;">
					{{item.createtime}}
				</view>
			</view>
		</view>
		
		<view style="height: 200rpx;width: 100%;"></view>
		
	</view>
</template>

<script>
	import FromToCountry from '@/components/FromToCountry.vue'
	import {HTTP_REQUEST_URL,HTTP_IMG_UTL,IMAGE_URL} from "@/config/app";
	import Server from '@/components/Server.vue';
	
	export default {
		components: {
			FromToCountry,Server
		},
		data() {
			return {
				//远程域名
				HTTP_IMG_UTL,
				HTTP_REQUEST_URL,
				IMAGE_URL,
				url: IMAGE_URL,
				shouqi_btn:1,
				//语言
				lang: this.$i18n.locale,
				//文字
				text:{
					consignee:this.$t('收货人'),
					mobile:this.$t('联系方式'),
					consignees:this.$t('收货人信息'),
					edit_consignee:this.$t('修改收货人'),
					start_address:this.$t('始发地'),
					end_address:this.$t('目的地'),
					country:this.$t('国家'),
					city:this.$t('城市'),
					address:this.$t('详细地址'),
					port_city:this.$t('通关口岸'),
					port_name:this.$t('口岸名称'),
					jiaohuo:this.$t('交货时间'),
					transport_process:this.$t('运输进度'),
					transport:this.$t('运输订单'),
					crossorder:this.$t('货代订单'),
					complete:this.$t('已完成'),
					shouqi:this.$t('收起进度'),
					chakan:this.$t('查看详情'),
				},
				
				progressPercent: 90, // 进度条的百分比
				consignee:'',
				consignee_tel:'',
				kaconsignee:'',
				kaconsignee_tel:'',
				id:0,
				join_order_id:0,
				status:0,
				loading:false,
				cooperation:{},
				orderDetail:{
					orderInfo:{
						type:'',
						release_info:{
							reach_city:{
								country_name:'',
								city_name:'',
								area_name:'',
							}
						}
					},
					orderJoin:{
						speed:'',
					},
					crossborder_area:{
						country_name:'',
						city_name:'',
						area_name:'',
						country_name_ru:'',
						city_name_ru:'',
						area_name_ru:'',
					}
				},
				show:false,
			}
		},
		onLoad(options) {
			if(options.id){
				this.id=options.id
				this.join_order_id=options.join_order_id
				this.status=options.status
			}
			this.$u.api.order.consigneeInfo({
				id:this.id,
			}).then(res => {
					this.consignee=res.consignee
					this.consignee_tel=res.consignee_tel
					this.kaconsignee=res.kaconsignee
					this.kaconsignee_tel=res.kaconsignee_tel
			})
			this.getCooperationOrderDetail()
			
		},
		// onShow(){
		// 	this.loading=false
		// },
		onReady() {
			uni.setNavigationBarTitle({
				title: this.$t("物流信息")
			})
		},
		mounted() {
			console.log(this.orderDetail);
		},
		methods:{
			xianshi(){
				if(this.orderDetail.orderInfo.type=='goods'&&this.orderDetail.orderInfo.release_info.is_express_price==2&&this.orderDetail.role==1){
					this.show=true;
				}else if(this.orderDetail.orderInfo.type=='crossborder'&&this.orderDetail.role==1){
					this.show=true;
				}else if(this.orderDetail.orderInfo.type=='transport'&&(this.orderDetail.orderInfo.release_info.release_type==2||(this.orderDetail.orderInfo.release_info.release_type==3&&this.orderDetail.orderInfo.release_info.human_type==1))&&this.orderDetail.role==1){
					this.show=true;
				}else if(this.orderDetail.orderInfo.type=='transport'&&(this.orderDetail.orderInfo.release_info.release_type==1||(this.orderDetail.orderInfo.release_info.release_type==3&&this.orderDetail.orderInfo.release_info.human_type==2))&&this.orderDetail.role==2){
					this.show=true;
				}
			},
			timestampToDate(timestamp) {
				const date = new Date(timestamp*1000); // 如果timestamp是字符串，确保它是整数：parseInt(timestamp)
				const year = date.getFullYear();
				const month = ('0' + (date.getMonth() + 1)).slice(-2); // 月份是从0开始的
				const day = ('0' + date.getDate()).slice(-2);
				const hours = ('0' + date.getHours()).slice(-2);
				const minutes = ('0' + date.getMinutes()).slice(-2);
				const seconds = ('0' + date.getSeconds()).slice(-2);
				return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
			},
			shouqi(){
				if(this.shouqi_btn==1){
					this.shouqi_btn=0
				}else{
					this.shouqi_btn=1
				}
			},
			saveConsignee(){
				this.$u.route({
					url: "/pages/ordering/detail/Consignee",
					params: {
						id: this.id,
						join_order_id:this.join_order_id,
						status:this.status,
					}
				})
			},
			saveKaConsignee(){
				this.$u.route({
					url: "/pages/ordering/detail/KaConsignee",
					params: {
						id: this.id,
						join_order_id:this.join_order_id,
						status:this.status,
					}
				})
			},
			xgConsignee(){
				this.$u.route({
					url: "/pages/ordering/detail/Consignee",
					params: {
						id: this.id,
						join_order_id:this.join_order_id,
						status:this.status,
						xg:1,
					}
				})
			},
			xgKaConsignee(){
				this.$u.route({
					url: "/pages/ordering/detail/KaConsignee",
					params: {
						id: this.id,
						join_order_id:this.join_order_id,
						status:this.status,
						xg:1,
					}
				})
			},
			transporturl(i){
				this.$u.route({
					url: "/pages/ordering/orderDetail",
					params: {
						id: i.id,
						join_order_id:i.join_order_id,
						isDetail:true,
						status:i.status,
					}
				})
			},
			crossborderurl(i){
				this.$u.route({
					url: "/pages/ordering/orderDetail",
					params: {
						id: i.id,
						join_order_id:i.join_order_id,
						isDetail:true,
						status:i.status,
					}
				})
			},
			//合作订单详情
			getCooperationOrderDetail(){
				const that = this
				that.$u.api.order.getCooperationOrderDetail({
					id: that.join_order_id,
					lang:that.lang
				}).then(res => {
					console.log(res)
					//关联子订单
					that.rlated_orders = res.rlated_orders
					that.orderDetail=res
					
					if(that.orderDetail.user_id !=that.orderDetail.release_user.id){
						that.cooperation = that.orderDetail.release_user
					}else{
						that.cooperation = that.orderDetail.join_user
					}
					this.xianshi()
					that.loading=true
					
					console.log(that.cooperation)
			
				})
			},
		}
	}
</script>


<style lang="scss" scoped>
	
	.cardBox {
		width: 96%;
		margin: 0 auto;
		margin-top: 30rpx;
		box-shadow: 0 0 10px #ddd;
		background: #ddd;
		padding: 10rpx 20rpx;
		border-radius: 10rpx;
		background: #fff;
		margin-bottom: 30rpx;
		position: relative;
	}
	.flex{width: 100%;display: flex;}
	.biao{margin-top: 0rpx; width: 75%; margin-left: 0rpx;font-size: 30rpx;  font-weight: bold;}
	.biao_span{color:darkorange ; font-size: 18px; margin-right: 5px;}
	.edit{color: white; background-color: orange;font-size: 12px; border-radius: 10rpx; padding: 10rpx 15rpx; text-align: center;}
	.status_btn{color: white; background-color: orange;font-size: 12px; margin-left: 100rpx; border-radius: 10rpx; padding: 10rpx 15rpx; text-align: center;}
	.cardTitle{font-size: 24rpx; width: 94%;padding-top: 6rpx;}
	.text{width: 90%;word-break: break-all;}
	.cardBox2 {
		width: 45%;
		margin-right: 3%;
		margin: 0 auto;
		margin-top: 30rpx;
		box-shadow: 0 0 10px #ddd;
		background: #ddd;
		padding: 10rpx 20rpx;
		border-radius: 10rpx;
		background: #fff;
		margin-bottom: 30rpx;
		position: relative;
	}
	.circle_dian{color: green;font-size: 50px; line-height: 10px; }
	.address {
		margin-bottom: 12rpx;
		font-size: 28rpx;
		position: relative;
		padding-left: 45rpx;
		
	
		.headline_img {
			position: absolute;
			left: 0;
			top: 4rpx;
			width: 30rpx;
			height: 30rpx;
		}
	
		.label {
			font-weight: 600;
			margin-bottom: 10rpx;
			color: #ff7200;
		}
	}
	.rounded-progress{
		  border-radius: 10px; /* 设置圆角的半径 */
	}
	.process{
		background-color: #eeeeee;width: 98%;margin-left: 1%; margin-top: 20px; 
		border-radius: 10rpx; line-height: 20px; padding:10rpx 20rpx;
	}
</style>